<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
 table{
     width: 800px;
     border: 2px solid red;
     margin:auto;
     /*合并单元格的线*/
     border-collapse: collapse;
 }
 th,td{
     border: 1px solid black;
    text-align: center;
 }

 /*偶数行的背景色*/
 tbody tr:nth-of-type(even){
     background-color: darkorange;
 }

 /*even 偶数行的背景色*/
 tbody tr:nth-of-type(even){
     background-color: darkorange;
 }

 tbody tr:hover{
     background-color: red;
 }

</style>
<body>


<!--表格-->
<table>
    <!--    表格标题-->
    <caption>

    </caption>
    <!--    表头-->
    <thead>
    <tr>
        <!--        th也是单元格 不过有加粗效果-->
        <th>姓名</th>
        <th>性别</th>
        <th>年龄</th>
        <th>分数</th>
    </tr>
    </thead>
    <!--    表体-->
    <tbody>
    <!--    行-->
    <tr>
        <!--        td是单元格 有加粗效果-->
        <td>发发</td>
        <td rowspan="2">女</td>
        <td>32</td>
        <td>123</td>
    </tr>
    <tr>
        <!--        td是单元格 有加粗效果-->
        <td>嘎嘎</td>
        <td>32</td>
        <td>122</td>
    </tr>
    <tr>
        <!--        td是单元格 有加粗效果-->
        <td>帕帕</td>
        <td>男</td>
        <td>12</td>
        <td>123</td>
    </tr>

    <tr>
        <!--        td是单元格 有加粗效果-->
        <td>梅梅</td>
        <td>女</td>
        <td>32</td>
        <td>143</td>
    </tr>


    </tbody>

    <!--    表尾-->
    <tfoot>
    <tr>
        <td colspan="3">平均分</td>
        <td>99</td>

    </tr>
    </tfoot>
</table>
</body>
</html>